<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>中科碳和</title>
    <meta name="keywords" th:content="${SITE_CONFIG.SITE_KWD}">
    <meta name="description" th:content="${SITE_CONFIG.SITE_DESC}">
</head>
<body>

<div class="card-main" id="container">
    <div class="one" style="width: 86vw;height: 100%">
        <div class="content-top" style="border-radius:15px">
            <span class="card-text-title-btn">
                <button type="button" class="btn btn-primary" onclick="tcqy()">去体验</button>
            </span>
        </div>
    </div>
</div>

<script>

    $(function () {

        $('.one').mouseover(function () {
            enterCard($(this));
        });

        $('.one').mouseout(function () {
            outCard($(this));
        });

        $('.two').mouseover(function () {
            enterCard($(this));
        });

        $('.two').mouseout(function () {
            outCard($(this));
        });

        $('.three').mouseover(function () {
            enterCard($(this));
        });

        $('.three').mouseout(function () {
            outCard($(this));
        });
    });

    function enterCard(obj) {
        //边框变蓝色
        obj.find('div').addClass('card-main-mouseenter');
        obj.find('button').addClass('card-button-mouseenter')
    }

    function outCard(obj) {
        obj.find('div').removeClass('card-main-mouseenter')
        obj.find('button').removeClass('card-button-mouseenter')
    }
</script>
</div>
</body>
</html>
